<template>
	<view class="content" v-show="isShow">
		<image mode="aspectFill" class="logo" :src="customWebSite.alipayLogo_url"></image>
		<view class="yajin">
			押金：<text style="color: royalblue;">￥</text>
			<text
				style="color: red;font-size: 18px;">{{orderInfo.zucheCashPledge + orderInfo.regulationsCashPledge}}</text>
		</view>
		<view class="save">
			<button v-if="orderInfo.lesseeName && orderInfo.lesseeIdcard && customInfo.isTelecomOpen"
				open-type="getAuthorize" scope="phoneNumber" @getAuthorize="getPhoneNumber" @errorr="handleAuthError"
				type="primary">
				申请免押
			</button>
			<view v-else>
				<button 
					open-type="getAuthorize" scope="phoneNumber" @getAuthorize="getPhoneNumber2" @errorr="handleAuthError"
					type="primary">
					申请免押
				</button>
			</view>
			<button v-if="orderInfo.lesseeName && orderInfo.lesseeIdcard && customInfo.isTelecomOpen"
				open-type="getAuthorize" scope="phoneNumber" @getAuthorize="getPhoneNumber" @errorr="handleAuthError"
				type="primary">
				申请免押
			</button>
			<!-- <button v-else @click="doMianya" type="primary">申请免押</button> -->
		</view>
		<view class="text-area">
			支付成功即代表已阅读并同意 <text style="color: royalblue;" @click="toXieyi">《租凭及服务相关协议》</text>
		</view>
		<view style="height: 15px; width: 100%; background-color: #eee;"></view>
		<view class="text">
			<view class="text-title">芝麻信用-免押金</view>
			<view class="text-item" style="text-indent: 2em;">
				“芝麻评估”时，芝麻信用以用户信息为担保并授权，最高可免除30000元押金，超出部分以“资金授权”形式冻结在支付宝账户内</view>
			<view class="text-title">支付宝资金授权</view>
			<view class="text-item" style="text-indent: 2em;">支付宝“资金授权”支持用户以余额，余额宝，信用卡，借记卡，花呗以及芝麻信用渠道做预授权</view>
			<view class="text-item">余额，余额宝：资金冻结；</view>
			<view class="text-item">信用卡，借记卡：扣款至支付宝类账户做资金锁定；</view>
			<view class="text-item">花呗：锁定额度，不产生账期；</view>
			<view class="text-item">芝麻信用：以用户信用为担保并授权</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				isShow: false,
				orderSn: '',
				orderInfo: '',
				customInfo: {},
				customWebSite: {},
				resultCode: {
					9000: '订单授权成功',
					8000: '正在处理中',
					4000: '订单支付失败',
					6001: '用户中途取消',
					6002: '网络连接出错',
					99: '用户点击忘记密码导致快捷界面退出',
				}
			}
		},
		onLoad(e) {
			this.orderSn = e.orderSn
		},
		onShow() {
			this.getCustom()
		},
		methods: {
			handleAuthError() {

			},
			getPhoneNumber2() {
				let _this = this;
				uni.showLoading({
					title: '获取手机号中...'
				})
				my.getPhoneNumber({
					success: (res) => {
						let encryptedData = res.response;
						_this.$httpSend({
							type: 'post',
							path: '/api/v1/alipay/user/getMobile',
							data: JSON.parse(encryptedData),
							complete() {},
							success: (r) => {
								//_this.authMobile(r.mobile)
								_this.doMianya(r.mobile)
							}
						});
					},
					fail: (res) => {
						console.log(res);
						uni.showToast({
							title: '获取手机号失败',
							icon: 'error',
							complete() {}
						})
					},
				});
			},
			getPhoneNumber() {
				let _this = this;
				uni.showLoading({
					title: '获取手机号中...'
				})
				my.getPhoneNumber({
					success: (res) => {
						let encryptedData = res.response;
						_this.$httpSend({
							type: 'post',
							path: '/api/v1/alipay/user/getMobile',
							data: JSON.parse(encryptedData),
							complete() {},
							success: (r) => {
								_this.authMobile(r.mobile)
							}
						});
					},
					fail: (res) => {
						console.log(res);
						uni.showToast({
							title: '获取手机号失败',
							icon: 'error',
							complete() {}
						})
					},
				});
			},
			authMobile(mobile) {
				let _this = this;
				uni.showLoading({
					title: '手机号认证中...'
				})
				_this.$httpSend({
					path: '/api/v1/alipay/order/authMobile',
					data: {
						mobile:mobile,
						orderSn:this.orderSn,
					},
					complete() {},
					success: (res) => {
						_this.doMianya()
					}
				});
			},
			doMianya(mobile) {
				var _this = this;
				uni.showLoading({
					title: '资金授权中...'
				})
				_this.$httpSend({
					path: '/api/v1/alipay/Sesame/dofreeze',
					data: {
						orderSn: this.orderSn,
						mobile: mobile
					},
					complete() {},
					success: (data) => {
						_this.tradePay(data)
					}
				});
			},
			cancellPullup() {
				var _this = this;
				_this.$httpSend({
					path: '/api/v1/alipay/Sesame/cancellPullup',
					data: {
						orderSn: this.orderSn
					},
					complete() {},
					success: (data) => {
						
					}
				});
			},
			tradePay(orderStr) {
				var _this = this;
				my.tradePay({
					orderStr: orderStr, // 完整的支付参数拼接成的字符串，从服务端获取
					success: (res) => {
						if(res.resultCode == 9000 || res.resultCode == 8000) {
							uni.showToast({
								title: _this.resultCode[res.resultCode],
								icon: 'success',
								complete() {
									setTimeout(function() {
										uni.switchTab({
											url: '/pages/order/index'
										})
									}, 1000)
								}
							})
						} else {
							uni.showToast({
								title: _this.resultCode[res.resultCode],
								icon: 'error',
								complete() {
									_this.cancellPullup();
									setTimeout(function() {
										uni.switchTab({
											url: '/pages/order/index'
										})
									}, 1000)
								}
							})
						}
					},
					fail: (res) => {
						uni.showToast({
							title: _this.resultCode[res.resultCode],
							icon: 'error',
							complete() {}
						})
					}
				});
			},
			toXieyi() {
				uni.navigateTo({
					url: '/pages/agreement/car'
				})
			},
			getOrderInfo() {
				var _this = this;
				uni.showLoading({
					title: '加载中...'
				})
				_this.$httpSend({
					path: '/api/v1/alipay/Order/details',
					data: {
						orderSn: this.orderSn
					},
					complete() {},
					success: (data) => {
						_this.orderInfo = data
						_this.isShow = true;
					}
				});
			},
			getCustom() {
				var _this = this;
				_this.$httpSend({
					path: '/api/v1/alipay/Custom/getInfo',
					complete() {
						_this.getOrderInfo()
					},
					success: (data) => {
						_this.customInfo = data.info
						_this.customWebSite = data.webSite
					}
				});
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #fff;
	}

	.yajin {
		font-size: 20px;
		margin-top: 50px;
		background-color: #dedede;
		border-radius: 10px;
		padding: 10px 20px;
		width: 70%;
	}

	.save {
		margin-top: 30px;
		width: 80%;
	}

	.save button {
		border-radius: 50px;
		width: 100%;
	}

	.logo {
		width: 200px;
		height: 200px;
		margin-top: 50rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 20rpx;
	}

	.text-area {
		justify-content: center;
		font-size: 14px;
		margin-top: 30px;
		padding-bottom: 40px;
	}

	.text {
		padding: 15px;
		padding-top: 0px;
	}

	.text-title {
		font-size: 18px;
		font-weight: 600;
		margin-bottom: 10px;
		margin-top: 15px;
	}

	.text-item {
		font-size: 14px;
		margin-bottom: 5px;
		line-height: 1.5;
	}
</style>